<template>
	<view class="page">
		<view class="yhq-box">
			<view class="title">个人会员权益</view>
			<view class="person" v-for="(item,index) in list1" :key="index" >
				<image src="/static/yhq.png"></image>
				<view class="textBox">
											<view class="left" @click="getCoupons(item.dataImg,1)">
												<view>领</view>
												<view>取</view>
											</view> 
											<view class="right">
												<text>{{item.dataNum}}元</text>
												<text>{{item.dataName}}</text>
											</view> 
				</view>
			</view>
		</view>
		<view class="yhq-box">
			<view class="title">团体会员权益</view>
			<view class="person" v-for="(item,index) in list2" :key="index">
				<image src="/static/yhq.png"></image>
				<view class="textBox">
											<view class="left" @click="getCoupons(item.dataImg,2)">
												<view>领</view>
												<view>取</view>
											</view> 
											<view class="right">
												<text>{{item.dataNum}}元</text>
												<text>{{item.dataName}}</text>
											</view> 
				</view>
			</view>
		</view>
            <uni-popup ref="inputDialog" type="dialog">
				<uni-popup-dialog   mode="input" :title="title" ref="inputClose"
					placeholder="请输入" @confirm="dialogInputConfirm"></uni-popup-dialog>
			</uni-popup>
			<uni-popup ref="popupSuccess" type="message">
				<uni-popup-message :type="type" :message="message" :duration="2000"></uni-popup-message>
			</uni-popup>
	</view>
</template>

<script>
	import {showbaseinfobyworktype,getvipcard} from "../../common/api.js"
	export default {
		data() {
			return {
				list1:[],
				list2:[],
				title:'',
				youhuiquantype:'',
                type:'',
				message:''
			}
		},
		created(){
			showbaseinfobyworktype({dataType:'daijinquan',dataurl:'geren'}).then(res=>{
				this.list1=res.extend.list
			})
			showbaseinfobyworktype({dataType:'daijinquan',dataurl:'tuanti'}).then(res=>{
				this.list2=res.extend.list
			})
		},
		methods: {
			getCoupons(id,type){
				this.youhuiquantype=id
				if(type==1){
					this.title="个人权益号"
				}else{
					this.title="团体权益号"
				}
				this.$refs.inputDialog.open()
				this.$refs.inputClose.val = ''
			},
			dialogInputConfirm(val) {
				let currUser = uni.getStorageSync('currUser')
							// this.$refs.inputDialog.close()
							if(val==''){
								uni.showToast({
									title:'请先输入会员号',
									icon: 'error',
									duration: 2000
								})
								return
							}
							let data={
								userid:currUser.userid,
								usertypeid:val,
								usertype:this.title=="个人权益号"?'2':'1',
								youhuiquantype:this.youhuiquantype
							}
							getvipcard(data).then(res=>{
								if(res.code=='100'){
									this.type="success"
									this.message=res.extend.MSG
									
										this.$refs.popupSuccess.open()
									
								}else{
									this.type="error"
									this.message=res.extend.MSG
									
										this.$refs.popupSuccess.open()
								}
								this.$refs.inputClose.val = ''
							}).catch(err=>{
								this.type="error"
								this.message=err.data.extend.MSG
									this.$refs.popupSuccess.open()
								this.$refs.inputClose.val = ''
							})
						},
		}
	}
</script>

<style scope lang="scss">
.page{
	background:#fff;
	min-height:100vh;
	padding:30rpx;
}
view{
	box-sizing: border-box;
}
.yhq-box{
	.title{
		font--size:16px;
		font-weight: bold;
		line-height:30px;
	}
	.person{
		position:relative;
		width:100%;
		height:240rpx;
		image{
			width:100%;
			height:240rpx;
			position:absolute;
			top:0;
			left:0;
			z-index:0;
		}
		.textBox{
			.left{
				position:absolute;
				top:75rpx;
				left:0;
				z-index:1;
				color:#fff;
				font-weight: bold;
				font-size:17px;
				width:18%;
				text-align:center;
			}
			.right{
				padding:0 30rpx;
				position:absolute;
				top:0;
				left:18%;
				width:82%;
				height:240rpx;
				z-index:1;
				display:flex;
				flex-direction: column;	
				justify-content: center;
				text:nth-child(1){
					font-size:16px;
					font-weight: bold;
				}
			}
		}
	}
}
</style>
